<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>客户管理</title>
	<meta name="decorator" content="default"/>
	<style type="text/css">
		#searchForm fieldset{
			display:inline-block;
		}
	</style>
</head>
<body>
	<div class="icon-buttons">
		<input type="button" class="leave-clean-session" data-inline="true" data-icon="back" data-iconpos="notext" value="返回"/>
	</div>
	<form:form id="searchForm" modelAttribute="customer" action="${ctx}/base/customer/" method="post">
		<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
		<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
		<div class="middleCls">
	  		<input type="button" value="客户添加" data-inline="true" onclick="loginPasswordPopup('${ctx}/base/customer/form')">
		  	<fieldset data-role="controlgroup" data-type="horizontal" data-inline="true">
		        <input type="radio" name="searchType" id="radio-choice-a" value="0" ${empty searchType || searchType == '0' ? 'checked' : ''}>
		        <label for="radio-choice-a">姓名</label>
		        <input type="radio" name="searchType" id="radio-choice-b" value="1" ${searchType == '1' ? 'checked' : ''}>
		        <label for="radio-choice-b">备注名</label>
		        <input type="radio" name="searchType" id="radio-choice-c" value="2" ${searchType == '2' ? 'checked' : ''}>
		        <label for="radio-choice-c">手机号码</label>
			</fieldset> 
	  		<input id="keyWord" name="keyWord" type="search" data-inline="true" value="${keyWord}"/>
		  	<input id="btnSubmit" type="submit" value="查询" data-inline="true"/>
		  	<input id="btnImport" type="button" data-inline="true" value="导入"/>
			<input id="btnExport" type="button" data-inline="true" value="导出"/>
		</div>
	</form:form>
	<tags:message content="${message}"/>
	<div  class="form-input">
		<table id="contentTable" data-role="table" class="ui-responsive table-stroke">
			<thead><tr><th>名称</th><th>备注名</th><th>电话</th></tr></thead>
			<tbody>
			<c:forEach items="${page.list}" var="customer">
				<tr id="${customer.id}">
					<td>${customer.name}</td>
					<td>${customer.nickname}</td>
					<td>${fns:replaceTel(customer.mobile)}</td>
				</tr>
			</c:forEach>
			</tbody>
		</table>
		<div class="pagination">${page}</div>
	</div>
	<script type="text/javascript">
		$(document).ready(function() {
			$(".operateTD").click(function(){
				operateMenu(this.id);
			});
			$("#contentTable tbody tr").click(function(e){
				if (!this.id) {
					return;
				}
				sessionStorage.target = "list";
				$("#contentTable tbody tr").removeClass("select_active");
				$(this).addClass("select_active");
				var url = "${ctx}/base/customer/detail?id=" + this.id;
				window.location.href = url;
			});
			$("body").click(function(e){
				$(".ui-icon-arrow-u").removeClass("ui-icon-arrow-u").addClass("ui-icon-arrow-d");
				$(".opreationTR").removeClass("opreationTR");
				$(".opreation").remove();
			});
			
			$("#searchForm").validate({
				submitHandler: function(form){
					var type = $('input:radio[name=searchType]:checked').val();
					var key = $('#keyWord').val();
					if (type == '2'){
							if(!isNaN(key)){
							   loading('正在提交，请稍等...');
							   form.submit();
							}else{
								showTip("电话号码必须是数字！");
							}
					} else {
						 loading('正在提交，请稍等...');
						 form.submit();
					}
				}
			});	
			
			$(document).delegate('.customerPanel', 'click', function() {
				loginPasswordPopup('${ctx}/base/customer/detail?id=' + this.id + '&target=list');
			});
			if(global.isMobile()) {
				$("#btnImport").parent().css("display", "none");
				$("#btnExport").parent().css("display", "none");
			} else {
				$("#btnExport").click(function(){
					global.confirm("确认要导出客户信息？", exportExcel);
				});
				$("#btnImport").click(function(){
					global.uploadDialog("客户资料上传", customerUpload, customerTemplate);
				});
			}
		});
		var item;
		function operateMenu(id){
			item = $("#opreation-"+ id);
			$(".opreationTR").removeClass("opreationTR");
			$(".ui-icon-arrow-u").removeClass("ui-icon-arrow-u").addClass("ui-icon-arrow-d");
			if(item.length > 0) {
				item.remove();
				this.event.stopPropagation();
				return;
			}
			$("#"+id + " .ui-icon-arrow-d").removeClass("ui-icon-arrow-d").addClass("ui-icon-arrow-u");
			$(".opreation").remove();
			var url = "${ctx}/base/customer/detail?id=" + id + "&target=list";
			var html= "<tr id='opreation-" + id + "' class='opreation'><td colspan='6'>";
				html += "<a data-role='button' data-inline='true' href='" + url+ "'>明细</a></td></tr>";
				html += "<a class='menu-del' data-role='button' data-inline='true' href='#'>删除</a></td></tr>";
			var del = function(){
				var url = "${ctx}/base/customer/delete?id=" + id;
				bossLoginDeletePopup("确定要删除此客户？", url);
			};
			
			$(".menu-del").die().live('click',del);
			$("#" + id).addClass("opreationTR");
			$("#" + id).after(html);
			$("#contentTable").trigger("create");
			this.event.stopPropagation();
		}
		function customerUpload(){
			if(beforeUpload() == false){
				return;
			}
			$.ajaxFileUpload({
					url:'${ctx}/base/customer/import',
					secureuri:false,
					fileElementId:'fileToUpload',
					dataType: 'json',
					beforeSend:function()
					{
						$("#loading").show();
					},
					complete:function()
					{
						$("#loading").hide();
					},				
					success: function (data, status)
					{
						var msg = "导入客户信息完成：<br/>";
						if (data.successNum && data.failureNum){
							var snum = parseInt(data.successNum);
							var fnum = parseInt(data.failureNum);
							msg += "<h5>您要导入的文件中总计有" + (snum + fnum) + "条数据,导入成功" + snum + "条,失败" + fnum + "条</h5><br/>";
						}
						if (parseInt(data.failureNum) > 0) {
							msg += "失败信息如下：<br/><h5>";
							var errorArr = data.errorMsg.split(";");
							for (var i = 0, len = errorArr.length; i < len; i ++) {
								msg += errorArr[i] + "<br/>";
							}
							msg += "</h5>";
						}
						global.alert(msg);
					},
					error: function (data, status, e)
					{
						showTip(e);
					}
				}
			);
            return false;
		}
		function customerTemplate(){
			var url = "${ctx}/base/customer/import/template";
			window.location.href = url;
		}
		function exportExcel(){
			var type = $('input:radio[name="searchType"]:checked').val();
			var keyWord = $('#keyWord').val();
			var url = "${ctx}/base/customer/export?type=" + type +"&key="+ keyWord;
			window.location.href = url;
		}
		function page(n,s){
			$("#pageNo").val(n);
			$("#pageSize").val(s);
			$("#searchForm").submit();
        	return false;
        }
	</script>
</body>
</html>
